<extend name='Block/Admin_public'/>
<block name="content">
<script src="__JS__/echart.min.js"></script>
    <div>
	    <table class="fl table table-striped ml20" style="width:180px;" border="1px" bordercolor="#dedede">
	        <tr>
	    		<td bgcolor="#36bc9b" align="center" class="colorwhite">统计参数</td>
	    	</tr>
	    	<tr>
	    		<td>会员人数：<span class="badge">{$usercount}</span></td>
	    	</tr>
	    	<tr>
	    		<td>当前在线人数：<span class="badge">{$onlinecount}</span></td>
	    	</tr>
	    	<tr>
	    		<td>今日访问量：<span class="badge">{$viewcount}</span></td>
	    	</tr>
	    </table>
	    <table class="fl table table-striped ml20 mr10" style="width:300px;" border="1px" bordercolor="#dedede">
	        <tr>
	    		<td bgcolor="#36bc9b" align="center" class="colorwhite" colspan="2">访问地址排名</td>
	    	</tr>
	    	<tr>
	    		<td width="90px">点击次数：</td>
	    		<td >url：</td>
	    	</tr>
            <volist name='vs' id='vs'>
	    	<tr>
	    		<td>{$vs.count}</td>
	    		<td>
                    <span class='shenglve' style="width:190px;overflow:hidden;display:block">
                      <a href='{$vs.v_url}' target="block">{$vs.v_url}</a>
                    </span>
                </td>
	    	</tr>
            </volist>
	    </table>
		<div id="main" class="fl"  style="width: 550px;height:250px;"></div>
        <div class="clear"></div>
    	<table class="fl table table-striped ml20" style="width:500px;" border="1px" bordercolor="#dedede">
	        <tr>
	    		<td bgcolor="#36bc9b" align="center" class="colorwhite" colspan="4">后台管理登录统计</td>
	    	</tr>
	    	<tr>
	    		<td>登录者</td>
	    		<td>登录时间</td>
	    		<td>登录ip</td>
	    		<td>登录地点</td>
	    	</tr>
            <volist name='log' id='log'>
	    	<tr>
	    		<td>{$log.username}</td>
	    		<td>{:date('Y-m-d H:i:s',$log['log_createtime'])}</td>
	    		<td>{$log.log_ip}</td>
	    		<td>{$log.area}</td>
	    	</tr>
            </volist>
	    </table>
	    <div id='bing' class="fl ml20" style="width:550px; height:300px"></div> 
    </div>

	<script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'));
        var bingChart = echarts.init(document.getElementById('bing'));

        // 指定图表的配置项和数据
        option = {
    title: {
        text: '最近一周访问'
    },
    tooltip : {
        trigger: 'axis'
    },
    legend: {
        data:['访问量']
    },
    toolbox: {
        feature: {
            saveAsImage: {}
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis : [
        {
            type : 'category',
            boundaryGap : false,
            data : [
               <volist name="weekc" id="week">
                   '{$week['week']}',
               </volist>
            ]
        }
    ],
    yAxis : [
        {
            type : 'value'
        }
    ],
    series : [
        {
            name:'访问量',
            type:'line',
            stack: '总量',
            areaStyle: {normal: {}},
            data:[
                <volist name="weekc" id="coo">
                   '{$coo['count']}',
               </volist>
            ]
        },
        
    ]
};

bing = {
    title : {
        text: '用户访问来源',
        subtext: '纯属虚构',
        x:'center'
    },
    tooltip : {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    legend: {
        orient: 'vertical',
        left: 'left',
        data: ['直接访问','搜索引擎','友情链接']
    },
    series : [
        {
            name: '访问来源',
            type: 'pie',
            radius : '55%',
            center: ['50%', '60%'],
            data:[
                {value:"{$from['self']}", name:'直接访问'},
                {value:"{$from['engine']}", name:'搜索引擎'},
                {value:"{$from['friend']}", name:'友情链接'},
            ],
            itemStyle: {
                emphasis: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ]
};

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
        bingChart.setOption(bing);
    </script>
</block>